<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/modules/cms/front/include/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>
    <title>${category.name}</title>
    <meta name="decorator" content="cms_default_${site.theme}"/>
    <meta name="description" content="${category.description}" />
    <meta name="keywords" content="${category.keywords}" />
    <style>
        .container{
            width:100%;
        }

        /*盈利分析*/
        .profitability{
            width:100%;
            height:653px;
        }
        .profitability .row{
            width:1200px;
            height:100%;
            position:relative;
            margin:0 auto;
        }
        .profitability .row .title{
            position:relative;
        }
        .profitability .row .title .outter{
            position:absolute;
            left:-17px;
            top:160px;
        }
        .profitability .row .title .inner{
            position:absolute;
            left:-36px;
            top:137px;
        }
        .profitability .row .title .item1{
            text-align:left;
            width:30px;
            line-height:30px;
            color:#fff;
            position:absolute;
            left:90px;
            top:295px;
            font-size:30px;
        }
        .profitability .row .title .english{
            display:block;
            position:absolute;
            left:25px;
            top:212px;
            writing-mode: vertical-rl;
            height:200px;
        }
        .profitability .row .bgImg{
            width:660px;
            height:400px;
            position:absolute;
            left:67px;
            top:105px;
            z-index:-1;
        }
        .profitability .row .article{
            position:absolute;
            width:534px;
            height:306px;
            left:662px;
            top:156px;
            font-size:16px;
            word-wrap:break-word;
        }

        /*合作方式*/
        .cooperation{
            width:100%;
            height:653px;
        }
        .cooperation .row{
            width:1200px;
            height:100%;
            position:relative;
            margin:0 auto;
        }
        .cooperation .row .title{
            position:relative;
        }
        .cooperation .row .title .outter{
            position:absolute;
            left:-17px;
            top:160px;
        }
        .cooperation .row .title .inner{
            position:absolute;
            left:-36px;
            top:137px;
        }
        .cooperation .row .title .item1{
            text-align:left;
            width:30px;
            line-height:30px;
            color:#fff;
            position:absolute;
            left:90px;
            top:295px;
            font-size:30px;
        }
        .cooperation .row .title .english{
            display:block;
            position:absolute;
            left:25px;
            top:222px;
            writing-mode: vertical-rl;
            height:200px;
        }
        .cooperation .row .bgImg{
            width:660px;
            height:400px;
            position:absolute;
            left:67px;
            top:105px;
            z-index:-1;
        }
        .cooperation .row .article{
            position:absolute;
            width:534px;
            height:306px;
            left:662px;
            top:156px;
            font-size:16px;
            word-wrap:break-word;
        }

        /*申请表单*/
        .forms{
            width:100%;
            height:720px;
            background-color: #7d7d7d;
        }
        .forms .row{
            width:1200px;
            height:100%;
            margin:0 auto;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .forms .row p{
            font-size:30px;
            color:#fff;
        }

    </style>
</head>
<body>

<c:forEach items="${categoryList}" var="category">
    <c:if test="${category.module=='article'}" >
        <div class="profitability">
            <div class="row">
                <div class="title">
                    <img src="http://13869797.s61i.faiusr.com/4/AD0I5cXOBhAEGAAgxZqVyQUoyI7JuQMwvgE4ogI.png" class="outter"/>
                    <img src="http://13869797.s61i.faiusr.com/4/AD0I5cXOBhAEGAAg1JyVyQUomIC3ETCWAThk.png" class="inner"/>
                    <span class="item1">${category.name}</span>
                    <span class="english">LENONG&nbsp;</span>
                </div>
                <div class="span6 pull-left bgImg">
                    <img src="http://13869797.s61i.faiusr.com/4/AD0I5cXOBhAEGAAgiZyVyQUo-s2ILjCUBTiQAw.png"/>
                </div>
                <div class="pull-right article">
                    <p>${category.description}</p>
                </div>
            </div>
        </div>
    </c:if>
</c:forEach>
<%--申请表单--%>
<div class="forms">
    <div class="row">
        <p>这是申请表单</p>
    </div>
</div>
</body>
</html>
